<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>GT pro钱包</title>
		<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
		<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
		<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
		<link rel="stylesheet" href="bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
		<link rel="stylesheet" href="dist/css/AdminLTE.min.css">
		<link rel="stylesheet" href="dist/css/skins/skin-blue.min.css">
		<link rel="stylesheet" href="css/style.css">
		<link rel="stylesheet" href="css/fr_style.css">
		<link rel="stylesheet" href="css/card.css">
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">

		<link rel="stylesheet" href="bower_components/bootstrap-daterangepicker/daterangepicker.css">
		<link rel="stylesheet" href="bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css">
		
		<script type="text/javascript" src="./libs/spark-md5-3.0.0.min.js"></script>
	    <script type="text/javascript" src="./libs/crypto-js.js"></script>
	    <script type="text/javascript" src="./libs/base64.min.js"></script>
	    <script type="text/javascript" src="./libs/ufile-token.js"></script>
		<style type="text/css">
			textarea{
				width: 100%;
				border: 1px solid #ddd;
				line-height: 24px;
				padding: 5px 10px;
				height: 500px;
			}
			#localImgBtn + .ke-upload-button{
				display: none;
			}
			.h5_html img{
				width:100%;
			}
		</style>
	</head>

	<body class="hold-transition skin-blue sidebar-mini">
		<div class="wrapper">
			<div class="content-wrapper">
				<section class="content-header">
					<ol class="breadcrumb">
						<li>
							<a href="#"><i class="fa fa-dashboard"></i>游戏用户</a>
						</li>
						<li class="active">投资产品列表</li>
					</ol>
				</section>
				<section class="content">
					<div class="box">
						<div class="box-header with-border">
							投资产品列表
						</div>
						<div class="buyu_search_group">
							<div class="row" style="margin-bottom:10px;">
								<div class="col-xs-12 col-sm-6 col-lg-3">
									<button type="button" class="btn bg-primary margin" onclick="addUser()"><i class="fa fa-plus" ></i>&nbsp;新增</button>
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-12">
								<!-- /.box-header -->
								<div class="box-body">
									<table id="example" class="display nowrap table table-bordered table-striped" style="width:100%;">
										<thead>
											<tr>
												<th>id</th>
												<th>标题</th>
												<th>说明</th>
												<th>添加时间</th>
												<th>结束时间</th>
												<th>说明</th>
												<th>规则</th>
												<th>状态</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody></tbody>
									</table>
								</div>
							</div>
						</div>
					</div>

				</section>
			</div>
		</div>
		<div class="modal fade parents in" id="addProductModal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header"> 
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">	        
							<span aria-hidden="true">×</span>			
						</button>
						<h4 class="modal-title">添加商品</h4>
					</div>
					<div class="modal-body">
						<div class="row">
								<label class="margin-bottom-none col-xs-12">标题<input type="text" class="form-control" name="title"></label>
								
								<label class="margin-bottom-none col-xs-12">产品名称<input type="text" class="form-control" name="name"></label>
								<label class="margin-bottom-none col-xs-12">标签<input type="text" class="form-control" name="tag"></label>
								<label class="margin-bottom-none col-xs-12">备注<input type="text" class="form-control" name="remark"></label>
								<label class="margin-bottom-none col-xs-12">时长（天）<input type="text" class="form-control" name="duration"></label>
								<label class="margin-bottom-none col-xs-12">参与总数<input type="text" class="form-control" name="max_num"></label>
								<label class="margin-bottom-none col-xs-12">收益百分比<input type="text" class="form-control" name="income_rate"></label>
								<label class="margin-bottom-none col-xs-12">最小参与数量<input type="text" class="form-control" name="min_join_num"></label>
								<label class="margin-bottom-none col-xs-12">结束时间<input type="text" name="end_time" id="end_time" class="form-control"></label>
								<label class="margin-bottom-none col-xs-12">滚动消息内容<input type="text" name="notice_detail" id="notice_detail" class="form-control"></label>
								<label class="margin-bottom-none col-xs-12">单用户最大参与数量<input type="text" class="form-control" name="user_max_num"></label>
								<label class="margin-bottom-none col-xs-12">参与币种<select type="text" class="form-control coin_list" name="join_coin_id"></select></label>
								<label class="margin-bottom-none col-xs-12">收益币种<select type="text" class="form-control coin_list" name="income_coin_id"></select></label>
								<label class="margin-bottom-none col-xs-12">是否可赎回<select type="text" class="form-control" name="can_back">
									<option value="0">不可以</option>
									<option value="1">可以</option>
								</select></label>
								<label class="margin-bottom-none col-xs-12">是否展示进度条<select type="text" class="form-control" name="show_progress">
									<option value="0">不显示</option>
									<option value="1">显示</option>
								</select></label>
								<label class="margin-bottom-none col-xs-12">状态
									<select type="text" class="form-control" name="status">
										<option value="0">进行中</option>
										<option value="1">已结束</option>
										<option value="3">即将上线</option>
									</select>
								</label>
								<label class="margin-bottom-none col-xs-12">规则&nbsp;&nbsp;
									<div class="input-group">
										<input type="text" class="form-control editorEdit" name="rule"  disabled="disabled">
										<div class="input-group-btn">
											<button class="btn btn-primary editorEdit" type ="rule" key="add">编辑规则</button>
										</div>
									</div>
								</label>
								<label class="margin-bottom-none col-xs-12">项目说明&nbsp;&nbsp;
									<div class="input-group">
										<input type="text" class="form-control editorEdit" name="intro"  disabled="disabled">
										<div class="input-group-btn">
											<button class="btn btn-primary editorEdit" type ="intro" key="add">编辑项目说明</button>
										</div>
									</div>
								</label>
						</div>
					</div>
					<div class="modal-footer"><button type="button" class="btn btn-primary save" onclick="addSave()">确定</button></div>
				</div>
			</div>
		</div>
		
		<div class="modal fade parents in" id="editProductModal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header"> 
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">	        
							<span aria-hidden="true">×</span>			
						</button>
						<h4 class="modal-title">编辑商品</h4>
					</div>
					<div class="modal-body">
						<div class="row">
								<input type="hidden" name="id">
								<label class="margin-bottom-none col-xs-12">标题<input type="text" class="form-control" name="title"></label>
								
								<label class="margin-bottom-none col-xs-12">产品名称<input type="text" class="form-control" name="name"></label>
								<label class="margin-bottom-none col-xs-12">标签<input type="text" class="form-control" name="tag"></label>
								<label class="margin-bottom-none col-xs-12">备注<input type="text" class="form-control" name="remark"></label>
								<label class="margin-bottom-none col-xs-12">时长（天）<input type="text" class="form-control" name="duration"></label>
								<label class="margin-bottom-none col-xs-12">参与总数<input type="text" class="form-control" name="max_num"></label>
								<label class="margin-bottom-none col-xs-12">收益百分比<input type="text" class="form-control" name="income_rate"></label>
								<label class="margin-bottom-none col-xs-12">最小参与数量<input type="text" class="form-control" name="min_join_num"></label>
								<label class="margin-bottom-none col-xs-12">结束时间<input type="text" name="end_time" id="edit_end_time" class="form-control"></label>
								<label class="margin-bottom-none col-xs-12">滚动消息内容<input type="text" name="notice_detail" class="form-control"></label>
								<label class="margin-bottom-none col-xs-12">单用户最大参与数量<input type="text" class="form-control" name="user_max_num"></label>
								<label class="margin-bottom-none col-xs-12">参与币种<select type="text" class="form-control coin_list" name="join_coin_id"></select></label>
								<label class="margin-bottom-none col-xs-12">收益币种<select type="text" class="form-control coin_list" name="income_coin_id"></select></label>
								<label class="margin-bottom-none col-xs-12">是否可赎回<select type="text" class="form-control" name="can_back">
									<option value="0">不可以</option>
									<option value="1">可以</option>
								</select></label>
								<label class="margin-bottom-none col-xs-12">是否展示进度条<select type="text" class="form-control" name="show_progress">
									<option value="0">不显示</option>
									<option value="1">显示</option>
								</select></label>
								<label class="margin-bottom-none col-xs-12">状态
									<select type="text" class="form-control" name="status">
										<option value="0">进行中</option>
										<option value="1">已结束</option>
										<option value="3">即将上线</option>
									</select>
								</label>
								<label class="margin-bottom-none col-xs-12">规则&nbsp;&nbsp;
									<div class="input-group">
										<input type="text" class="form-control editorEdit" name="rule"  disabled="disabled">
										<div class="input-group-btn">
											<button class="btn btn-primary editorEdit" type ="rule" key="edit">编辑规则</button>
										</div>
									</div>
								</label>
								<label class="margin-bottom-none col-xs-12">项目说明&nbsp;&nbsp;
									<div class="input-group">
										<input type="text" class="form-control editorEdit" name="intro"  disabled="disabled">
										<div class="input-group-btn">
											<button class="btn btn-primary editorEdit" type ="intro" key="edit">编辑项目说明</button>
										</div>
									</div>
								</label>
						</div>
					</div>
					<div class="modal-footer"><button type="button" class="btn btn-primary save" onclick="editSave()">确定</button></div>
				</div>
			</div>
		</div>
		
		<div class="modal fade parents in" id="addNextIntroModal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header"> 
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">	        
							<span aria-hidden="true">×</span>			
						</button>
						<h4 class="modal-title">编辑器</h4>
					</div>
					<input type="hidden" name="id"/>					
					<input type="hidden" name="key"/>
					<input type="hidden" name="type"/>
					<div class="modal-body">
						<textarea id="editor" name="rule" style="width:100%;"></textarea>
					</div>
					<div class="modal-footer"><button type="button" class="btn btn-primary save" onclick="editorSave()">确定</button></div>
				</div>
			</div>
		</div>
		<script src="bower_components/jquery/dist/jquery.min.js"></script>
		<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<script src="bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
		<script src="bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>

		<script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
		<script src="bower_components/moment/min/moment.min.js"></script>
		<script src="bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>

		<script charset="utf-8" src="kindeditor/kindeditor-all.js"></script>
		<script charset="utf-8" src="kindeditor/lang/zh-CN.js"></script>
		<script src="dist/js/adminlte.min.js"></script>
		<script src="js/argument.js"></script>
		<script src="js/fun.js"></script>
		<script src="js/nav.js"></script>
		<script src="js/pop.js"></script>
		<script src="js/getList.js"></script>
		<script type="text/javascript">

			var table = $('#example').DataTable({
				'ordering': false,
				'lengthChange': false,
				'searching': false,
				'info': true,
				"processing": true,
				"serverSide": true,
				'scrollX': true,
				"ajax": {
					"type": 'post',
					"url": url + "Back_ProductList",
					"contentType": "application/x-www-form-urlencoded",
					"headers": {
						"auth-token": localStorage.getItem("wallet_token")
					},
					"data": function(d) {

						var Json = {}; //
						Json.page_num = d.start / 10 + 1;
						var data = {};
						data.data = JSON.stringify(Json);
						return data;
					},
					"dataFilter": function(data) {
						var datajson = eval('(' + data + ')');
						if(datajson.status == 1000||datajson.status == 102) {
							ToLogin(datajson)
							return false;
						} else if(datajson.status != 1) {
							alert(datajson.error);
							return false;
						}
						var json = {};
						if(datajson.data == null) {
							json.recordsTotal = 0;
							json.recordsFiltered = 0;
							json.data = [];
							return JSON.stringify(json);
						} else {
							json.recordsTotal = datajson.data.length;
							json.recordsFiltered = datajson.data.length;
							json.data = datajson.data;
							return JSON.stringify(json);
						}
					}
				},
				"columns": [{
						data: 'id'
					},
					{
						data: 'title'
					},
					{
						data: 'remark'
					},
					{
						data: 'add_time'
					},
					{
						data: 'end_time'
					},
//					{
//						data: 'intro'
//					},
					{
						data:null,render:function(data){
							return '<div class="h5_html toolong" style="width:100px;max-height:120px;overflow-y:hidden;">'+data.intro+'</div>'	
						} //'rule'
					},
					{
						data:null,render:function(data){
							return '<div class="h5_html toolong" style="width:100px;max-height:120px;overflow-y:hidden;"  >'+data.rule+'</div>'	
						} //'rule'
					},
					{
						data: null,
						render: function(data) {
							var dataList = {
								0: {
									name: '进行中',
									color: 'info'
								},
								1: {
									name: '已结束',
									color: 'default'
								},
								3: {
									name: '即将上线',
									color: 'success'
								},
							}
							return '<div class="fr_status fr_' + dataList[data.status].color + '">' + dataList[data.status].name + '</div>'
						}
					},
					{
						data: null,
						render: function(data) {

							var str = "<input type='hidden' value='" + JSON.stringify(data) + "'>";
							return str + '<button type="button" class="btn bg-primary button-margin" onclick="edit(this)" id=""><i class="fa fa-pencil"></i>&nbsp;&nbsp;修改</button><button type="button" class="btn btn-danger button-margin" onclick="del(this)" id=""><i class="fa fa-trash-o"></i>&nbsp;&nbsp;删除</button>';
						}
					}
				]
			})
		</script>
		<script type="text/javascript">
			// 添加
			$('#end_time').datepicker({
				autoclose: true,
				format: 'yyyy-mm-dd',
			})
			$('#edit_end_time').datepicker({
				autoclose: true,
				format: 'yyyy-mm-dd',
			})
			KindEditor.ready(function(K) {
				var options = {
					filterMode: true
				}
				window.editor_rule = K.create('textarea[name="rule"]', options);
			});
			$.ajax({
				type: 'post',
				url: url + "Back_MainChainForCoin",
				contentType: "application/x-www-form-urlencoded",
				headers: {
					"auth-token": localStorage.getItem("wallet_token")
				},
				data: {
					data: JSON.stringify({
						page_num: 1
					})
				},
				dataType: 'json',
				success: function(res) {
					console.log(res);
					if(res.status == 1000||res.status == 102) {
						ToLogin(res)
						return false;
					} else if(res.status != 1) {
						alert(res.error);
						return false;
					}
					var id;
					$.each(res.data, function(index, item) {
						$(".coin_list").append('<option value='+item.id+'>'+item.name+'</option>');
					})
				}
			})
			
			
			
			
			$(".editorEdit").click(function(){
				$('addNextIntroModal input').val('');
				var type = $(this).attr("type");
				var key = $(this).attr("key");
				var id = $(this).attr("id");
				value = $(this).parent().prev().val();
				$("#addNextIntroModal").find('.ke-edit-iframe').contents().find("body").html("")
				$("#addNextIntroModal").modal('show')
				$("#addNextIntroModal input[name = type]").val(type)
				$("#addNextIntroModal input[name = key]").val(key)
				$("#addNextIntroModal input[name = id]").val(id)
				$("#addNextIntroModal").find('.ke-edit-iframe').contents().find("body").html(value)
			})
			
			function editorSave(){
				var text = $("#addNextIntroModal").find('.ke-edit-iframe').contents().find("body").html();
				var type = $("#addNextIntroModal [name = type]").val();
				var key = $("#addNextIntroModal [name = key]").val();
				var id = $("#addNextIntroModal [name = id]").val();
				console.log(type)
				if(key == 'add'){
					$("#addProductModal input[name="+type+"]").val(text)
				}else{
					$("#editProductModal input[name="+type+"]").val(text)
				}
				$("#addNextIntroModal").modal('hide');
			}
			
			function addSave() {
				var list =[
					'title',
					'name',
					'tag',
					'remark',
					'income_rate',
					'duration',
					'max_num',
					'min_join_num',
					'user_max_num',
					'join_coin_id',
					'income_coin_id',
					'status',
					'rule',
					'intro',
					'end_time',
					'can_back',
					'show_progress',
					'notice_detail'
				];
				var _data = {};
				$.each(list,function(index,item){
					_data[item] = $('#addProductModal [name = '+item+']').val()
				})
				console.log(_data);
				$.ajax({
					type: 'post',
					url: url + "Back_ProductAdd",
					"headers": {
						"auth-token": localStorage.getItem("wallet_token")
					},
					contentType: "application/x-www-form-urlencoded",
					data: {
						data: JSON.stringify(_data)
					},
					success: function(res) {
						if(res.status == 1000||res.status == 102) {
							ToLogin(res)
							return false;
						} else if(res.status != 1) {
							alert(res.error);
							return false;
						}
						$("#addProductModal").modal("hide");
						move("success", res.error);
						table.draw(false);
					}
				})
			}

			function addUser() {
				$("#addProductModal").modal('show')
				//window.location.href = 'product_list_add.html';
			}
			
			function edit(_this){
				$("#editProductModal").modal('show');
				var data = JSON.parse($(_this).siblings('input').val())
				console.log(data);
				$.each(data,function(index,item){
					$("#editProductModal [name="+index+"]").val(item);
				})
			}
			
			function editSave(){
				var list =[
					'id',
					'title',
					'name',
					'tag',
					'remark',
					'income_rate',
					'duration',
					'max_num',
					'min_join_num',
					'user_max_num',
					'join_coin_id',
					'income_coin_id',
					'status',
					'rule',
					'intro',
					'can_back',
					'show_progress',
					'notice_detail'
				];
				var _data = {};
				$.each(list,function(index,item){
					_data[item] = $('#editProductModal [name = '+item+']').val()
				})
				_data.end_time = $('#edit_end_time').val()
				$.ajax({
					type: 'post',
					url: url + "Back_ProductUpdate",
					"headers": {
						"auth-token": localStorage.getItem("wallet_token")
					},
					contentType: "application/x-www-form-urlencoded",
					data: {
						data: JSON.stringify(_data)
					},
					success: function(res) {
						if(res.status == 1000||res.status == 102) {
							ToLogin(res)
							return false;
						} else if(res.status != 1) {
							alert(res.error);
							return false;
						}
						$("#editProductModal").modal("hide");
						move("success", res.error);
						table.draw(false);
					}
				})
			}
			
			
			
			
			function delSave() {
				$.ajax({
					type: "post",
					url: url + "Back_ProductDel",
					'contentType': "application/x-www-form-urlencoded",
					"headers": {
						"auth-token": localStorage.getItem("wallet_token")
					},
					data: {
						data: JSON.stringify({ //昵称
							id: $("#delModal [name=id]").val(),
						})
					},
					dataType: "json",
					success: function(res) {
						if(res.status == 1000||res.status == 102) {
							ToLogin(res)
							return false;
						} else if(res.status != 1) {
							alert(res.error);
							return false;
						}
						$("#delModal").modal("hide");
						move("success", res.error);
						table.draw(false);
					}
				})
			}

			function del(_this) {
				var data = JSON.parse($(_this).siblings('input').val())
				var deleteJson = {
					name: "del",
					title: "删除",
					arg: {
						id: data.id,
						name: data.title
					}
				};
				deleteModal(deleteJson, 'delSave');
			}
		</script>
	</body>

</html>